<template lang="pug">

.rating-list-wrapper
  ul.table(v-show="filterRatings.length>0")
    li.row(v-for="(item,index) in filterRatings" :key="index")
      .line
      .user
        span.time {{format(item.rateTime)}}
        span.username {{item.username}}
        span.icon
          img.image(:src="item.avatar")
      .content
        .rating-type
          span.iconfont(:class="{'icongood1':item.rateType===0,'iconbad1':item.rateType===1}")
        .text {{item.text}}
  .noRating(v-show="filterRatings.length===0") 暂无评价
</template>

<script>
import formatMixin from '../../static/common/mixins/format'

export default {

  mixins: [formatMixin],

  props: {
    filterRatings: {
      type: Array,
      default() {
        return []
      }
    }
  },

}

</script>

<style lang="stylus" scoped>
@import "../../static/common/stylus/variable"

.rating-list-wrapper
  margin-bottom: 50px
  .table
    .row
      .line
        border-top:1px solid $color-light-grey-s
      .user
        font-size:$fontsize-medium
        color:$color-light-grey
        line-height:12px
        margin-top:16px
        .username
          float:right
          margin-left:6px
        .icon
          float:right
          .image
            width:12px
            height:12px
            border-radius:50%
      .content
        margin-top:16px
        margin-bottom:16px
        font-size:$fontsize-large
        .rating-type
          display:inline-block
          vertical-align:top
          .icongood1
            color:$color-blue
          .iconbad1
            color:$color-light-grey
        .text
          display:inline-block
          white-space:normal
  .noRating
    font-size:$fontsize-medium
    margin-top:16px

</style>
